<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>登录页面</title>
		<style>
			* {
				margin: 0px;
				padding: 0px;
			}

			.login {
			
				width: 100%;
				height: 100%;
				background: #999999;
				min-height: 100vh;
				text-align: center;
			}

			.login-name {
				width: 300px;
				height: 30px;
				background: #CCCCCC;
				border: 0px;
				margin: 20px;
			}

			.login-pass {
				margin: 10px;
				width: 300px;
				height: 30px;
				background: #CCCCCC;
				border: 0px;
			}

			.login-radio {
				display: flex;
				width: 300px;
				margin: 10px auto;
				justify-content: space-between;
			}

			.wjmm>a {
				text-decoration: none;
				color: white;
			}

			.btn {
				width: 300px;
				height: 40px;
				background: #484B4E;
				color: white;
				font-size: 18px;
				border: 0px;
				margin: 0px auto;
				cursor: pointer;
			}

			.img1 {
				display: flex;
				width: 300px;
				margin: 20px auto;
				justify-content: space-between;
			}

			.img1>span>a {
				color: white;
			}

			.error-message {
				color: red;
				margin: 10px;
			}
		</style>
	</head>
	<body>
		<div class="login">
			<div class="login1">
				<img src="img/login2.png" alt="" />
				<div class="error-message" id="errorMsg"></div>
				<p><input class="login-name" id="username" type="text" placeholder="用户名/手机号"></p>
				<p><input class="login-pass" id="password" type="password" placeholder="密码" /></p>
				<div class="login-radio">
					<span><input type="checkbox" id="autoLogin" />自动登录</span>
					<span class="wjmm"><a href="#">忘记密码？</a></span>
				</div>
				<p><button class="btn" id="loginBtn">登录良仓</button></p>
				<div class="img1">
					<span>
						<img src="img/qq.png" alt="" />
						<img src="img/wb.png" alt="" />
						<img src="img/dou.png" alt="" />
						<img src="img/hua.png" alt="" />
					</span>
					<span><a href="register.html">注册良仓</a></span>
				</div>
			</div>
		</div>
	</body>
	<script src="js/ajax.js"></script>
	<script>
		document.addEventListener('DOMContentLoaded', function() {
			const loginBtn = document.getElementById('loginBtn');
			const usernameInput = document.getElementById('username');
			const passwordInput = document.getElementById('password');
			const errorMsg = document.getElementById('errorMsg');
			const autoLogin = document.getElementById('autoLogin');

			if (localStorage.getItem('autoLogin') === 'true') {
				const savedUsername = localStorage.getItem('username');
				const savedPassword = localStorage.getItem('password');
				
				if (savedUsername && savedPassword) {
					usernameInput.value = savedUsername;
					passwordInput.value = savedPassword;
					autoLogin.checked = true;
				}
			}

			loginBtn.addEventListener('click', function() {
				const username = usernameInput.value.trim();
				const password = passwordInput.value.trim();
				const isAutoLogin = autoLogin.checked ? '1' : '0';

				if (!username) {
					errorMsg.textContent = '请输入用户名/手机号';
					return;
				}
				
				if (!password) {
					errorMsg.textContent = '请输入密码';
					return;
				}

			
				const params = `username=${encodeURIComponent(username)}&password=${encodeURIComponent(password)}&autoLogin=${isAutoLogin}&status=login`;
				
				loginBtn.disabled = true;
				loginBtn.textContent = '登录中...';
				
				
				ajax({
					url: 'http://8.134.172.28:3008/api_user',
					method: 'POST',
					params: params,
					type: 'JSON',  
					callback: function(data) {
						loginBtn.disabled = false;
						loginBtn.textContent = '登录良仓';
						
						console.log('响应数据:', data);
						
						if (data.message === '登录成功') {
							
							if (isAutoLogin === '1') {
								localStorage.setItem('autoLogin', 'true');
								localStorage.setItem('username', username);
								localStorage.setItem('password', password);
							} else {
								localStorage.removeItem('autoLogin');
								localStorage.removeItem('username');
								localStorage.removeItem('password');
							}
							
							errorMsg.textContent = '';
							alert(data.message);
							setTimeout(() => {
								window.location.href = 'index.html';
							}, 1000);
						} else {
							errorMsg.textContent = data.message || '登录失败';
						}
					}
				});
			});
		});
	</script>
</html>